<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>生日贺卡</title>
<link href="css/style.css" rel="stylesheet" type="text/css">
</head>
<body>
<!--定义ID属性-->
<div id="cont">
<!-- 定义class属性-->
  <p class="top">TO my friend Zhang：</p>
<!--  定义class属性为left，内容为左边文字-->
  <div class="left">
    <p>告别昨日的风霜雪雨，</p>
    <p>点燃生日的红蜡，</p>
    <p>放飞所有的伤情，</p>
  </div>
  <!--  定义class属性为left，内容为右边文字-->
  <div class="right">
    <p>迎接今日的幸福时光；</p>
    <p>留住美好的记忆；</p>
    <p>收起所有的眼泪，</p>
  </div>
  <!--  定义class属性为happy，内容为底部生日快乐-->
  <p class="happy">生日快乐！</p>
  <!--  定义class属性为bottom，内容为底部署名-->
  <p class="bottom">friend Li</p>
</div>
</body>
</html>